import Vue,{VNode} from 'vue';
import Modal from './Modal';
import Toast from '../toast';
import {copyToClipboard} from '../../../util/common';

export default Vue.extend({
	name:'ServiceError',
	props:{
		//是否显示
		value:Boolean,
		//错误类容
		content:String,
		//错误详细信息
		info:String,
	},
	data(){
		return {
			showDetails:false,
		};
	},
	render(h):VNode{
		return h(Modal,{
			props:{
				title:'HTTP请求失败',
				value:this.value,
				transitionAppear:true,
				confirmText:this.showDetails?'关闭详情':'错误详情',
				closeText:'关闭',
			},
			on:{
				input:(val:boolean) => {
					this.$emit('input',val);
				},
				confirm:() => {
					this.showDetails=!this.showDetails;
				},
				close:() => {
					this.$emit('close');
				},
				show:() => {
					this.$emit('show');
				},
				shown:() => {
					this.$emit('shown');
				},
				hide:() => {
					this.$emit('hide');
				},
				hidden:() => {
					this.$emit('hidden');
				},
			},
		},[
			h('div',{
				on:{
					click:() => {
						if(this.showDetails){
							copyToClipboard(this.info).then(() => {
								Toast.success({
									message:'错误详情已复制到粘贴板!',
									closeOnClick:true,
								});
							});
						}
					}
				}
			},this.content+(this.showDetails?'\n'+this.info:'')),
		]);
	},
});
